$(function(){
    var stage=document.querySelector("#stage");
    // console.log(stage)
    var bg1=stage.querySelectorAll(".bg1")[0];//stage下的class=bg的dom节点
    var bg2=stage.querySelectorAll(".bg2")[0];
    // console.log(bg1)
    var topval1=-200;
    var topval2=-968;
    var k=0;
    //背景图移动
    var t1=setInterval(() => {
        k++;
        if(k==768){
            topval1=-968;
        }else if(k==768*2){
            topval2=-968;
            k=0;
        }
        topval1+=1;
        topval2+=1;
        $(bg1).css("top",topval1);
        $(bg2).css("top",topval2);
    }, 1);

    var plane=$("#stage .plane").eq(0);//飞机对象
    //设置子弹宽高
    var bulletW=5;
    var bulletH=11;
    var bulletS=100;//射速
    // 键盘事件
    var showsize=30;//移速
    document.onkeydown=function(e){
        if(e.keyCode==87||e.keyCode==38){
            var bottom=parseInt($(plane).css("bottom"));
            var shang=parseInt($(plane).css("top"));
            if(shang>0){
            // console.log("上"+bottom);
            $(plane).css("bottom",bottom+showsize+"px");
            } 
        }else if(e.keyCode==83||e.keyCode==40){
            var top=parseInt($(plane).css("bottom"))
            if(top>0){
            // console.log("下"+top);
            $(plane).css("bottom",top-showsize+"px"); 
            }
        }else if(e.keyCode==65||e.keyCode==37){
            var right=parseInt($(plane).css("right"))
            var zuo=parseInt($(plane).css("left"))
            if(zuo>0){
            $(plane).css("right",right+showsize+"px");
            }
            // console.log("左"+right);
        }else if(e.keyCode==68||e.keyCode==39){
            var left=parseInt($(plane).css("right"))
            if(left>=9){//至于为什么大于9由于我的飞机长度不一，此处通过控制台测试决定大于数值
            $(plane).css("right",left-showsize+"px");
            }
            console.log("右"+left);
        }else if(e.keyCode==32){
            Setbullet();    
        }
    }
    //生成子弹
    function Setbullet(){
        var bulletX=parseFloat($(plane).css("left"))+$(plane).width()/2-bulletW/2;//子弹水平位置
        var bulletY=parseFloat($(plane).css("top"))-bulletH;
        $("<div class='bullet'></div>").css({"left":bulletX,"top":bulletY}).appendTo(stage);//子弹添加到舞台
    }
    //自动发射
    setInterval(() => {
        Setbullet();
    }, 500);
    //鼠标移动控制飞机
    stage.onmousemove=function(e){
        var planeX=e.clientX-parseFloat($(stage).css("margin-left"));
        var planeY=e.clientY;
        $(plane).css({"left":planeX-$(plane).width()/2,"top":planeY-$(plane).height()/2})
    }
    var enemy=document.getElementsByClassName("enemy");
    //产生敌机
    setInterval(() => {
        var num=parseInt(Math.random()*3)+1;
        var enemyWs=[57,69,169];
        // num=3;
        var rndleft=parseInt(Math.random()*$(stage).width()-enemyWs[num-1]);
        rndleft=rndleft<0?0:rndleft;
        $("<div class=\"enemy enemy"+num+"\"></div>").css({"left":rndleft,"top":-20}).appendTo($("#stage"));
    }, 1200);
    //控制敌机的时钟
    setInterval(() => {
        for(var i=0;i<enemy.length;i++){
            if($(enemy[i]).attr("class")=="enemy enemy1"){
            $(enemy[i]).css("top",parseInt($(enemy[i]).css("top"))+3);
            }else if($(enemy[i]).attr("class")=="enemy enemy2"){
                $(enemy[i]).css("top",parseInt($(enemy[i]).css("top"))+2);
            }else if($(enemy[i]).attr("class")=="enemy enemy3"){
                $(enemy[i]).css("top",parseInt($(enemy[i]).css("top"))+1);
            }
        }
    }, 10);
    //离开舞台敌机dom节点移除
    setInterval(() => {
        for(var i=0;i<enemy.length;i++){
            var totop_enemy=parseFloat($(enemy[i]).css("top"))
            var stage_height=parseFloat($(stage).css("height"));
            // console.log("舞台高度:"+stage_height+"飞机:"+totop_enemy);
            if(totop_enemy>stage_height){
                $(enemy[i]).remove();
                // console.log("移除成功");
            }
        }
    }, 500);
    //控制子弹的时钟
    setInterval(() => {
        if($(".bullet").length==0){return;}
        //溢出界面就删除子弹头dom节点 
        var bullets=$(".bullet");
        for(var i=0;i<bullets.length;i++){
            if(parseInt($(bullets[i]).css("top"))<0){
                $(bullets[i]).remove();
            }else{
                var bulletT=parseFloat($(bullets).eq(i).css("top"));
                $(bullets).eq(i).css({"top":(bulletT-5)+"px"}); 
            }
        }
    }, bulletS);
    //检测碰撞
    var Getcrash=monitorCrash();
    function monitorCrash(){
        return  setInterval(() => {
            //检测子弹与敌机是否碰撞
            var bullets=$(".bullet");
            for(var i=0;i<bullets.length;i++){
                for(var j=0;j<enemy.length;j++){
                    if(crash(bullets[i],enemy[j])){
                        $(bullets[i]).remove();
                        $(enemy[j]).remove();
                    }
                }
            }
            //检测自己与敌机是否碰撞
            for(var i=0;i<enemy.length;i++){
                if(crash(plane,enemy[i])){
                    alert("游戏结束");
                    gameover();
                }
            }
        }, 100);
    }
    //碰撞事件(子弹,敌机)
    function crash(ZD,DJ){
        var iscrash=false;//是否碰撞
        var a=$(ZD).height()/2+parseFloat($(ZD).css("top"))-parseFloat($(DJ).css("top"))-$(DJ).height()/2;
        var b=parseFloat($(ZD).css("left"))+$(ZD).width()/2-parseFloat($(DJ).css("left"))-$(DJ).height()/2;
        var c=$(ZD).width()/2+$(DJ).width()/2;
        if(a*a+b*b<=c*c){
            iscrash=true;   
        }
        return iscrash;
    }
    function startgame(){
        //显示玩家plane
        $(plane).css("display","block");
        Getcrash=monitorCrash();//碰撞检测start
    }
    function gameover(){
        clearInterval(Getcrash);//碰撞检测stop
        //清屏
        $(".enemy").remove();
        //隐藏玩家plane
        $(plane).css("display","none");
        if(confirm("再玩一次吗")){
            startgame();
        }
    }
});